<template>
    <div style="margin-top: 10px;">
        <div class="df">
            <div class="tiao" v-loading="signalsRadio1.loading" element-loading-text="加载中...">
                <p class="mt20 ml20">采购次数 (次)</p>
                <p class="mt20 ml20 size forBox">
                    <span class="forSize">{{ signalsRadio1.zhaobaioTiTle}}</span>
                </p>
            </div>
            <div class="jia" v-loading="signalsRadio1.loading" element-loading-text="加载中...">
                <p class="mt20 ml20">供应商数量 (家)</p>
                <p class="mt20 ml20 size forBox">
                    <span class="forSize">{{ signalsRadio1.zhaobiao_digital.cardinality_gy?.value }}</span>
                </p>
            </div>
            <div class="ci" v-loading="signalsRadio1.loading" element-loading-text="加载中...">
                <p class="mt20 ml20">采购总金额 (万)</p>
                <p class="mt20 ml20 size forBox">
                    <span class="forSize">{{ signalsRadio1.zhaobiao_digital.color_sum_price?.value ?
                        moneys(signalsRadio1.zhaobiao_digital.color_sum_price?.value) : '0' }}</span>
                </p>
            </div>
            <div class="ding" v-loading="signalsRadio1.loading" element-loading-text="加载中...">
                <p class="mt20 ml20">公告数量 (条)</p>
                <p class="mt20 ml20 size forBox">
                    <span class="forSize">{{ signalsRadio1.zhaobaioTiTle }}</span>
                </p>
            </div>
        </div>
        <div style="margin: 20px 0 0 0;">
            <!-- <Operation /> -->
        </div>
        <RivalryPkxq />
    </div>
</template>
  
<script setup>
import Operation from "../../../../search/computer/operation/index.vue";
import RivalryPkxq from "../../../../dataService/conster/rivalryPkxq/index.vue";
import { timestamp, diqu, moneys, money } from "@/utils/index";
import "@/assets/com/com.scss";
import { reactive, ref, onMounted } from "vue";
// import Pagination from "../pagin/index.vue";
import { useRadio1Store } from "@/pain/search/search";
import { useRouter } from "vue-router";
const router = useRouter();
const signalsRadio1 = useRadio1Store();
signalsRadio1.routerPush = router.currentRoute.value.name
onMounted(() => {
});
</script>
  
<style lang="scss" scoped>
.mr10 {
    margin-right: 10px;
}

// .forBox {
//     font-size: 22px;
//     font-family: Source Han Sans CN;
//     font-weight: bold;
// }

.forSize {
    margin-right: 5px;
    font-size: 34px;
    font-family: Source Han Sans CN;
    font-weight: bold;
}

.tiao {
    width: 13.75rem;
    height: 120px;
    background: url(@/assets/img/xq1.png) no-repeat;
    background-size: 100% 100%;
    color: #ffffff;
}

.jia {
    margin-left: 20px;
    background: url(@/assets/img/xq2.png) no-repeat;
    background-size: 100% 100%;
    width: 13.75rem;
    color: #ffffff;
    height: 120px;
}

.ci {
    margin-left: 20px;
    background: url(@/assets/img/xq3.png) no-repeat;
    background-size: 100% 100%;
    width: 13.75rem;
    color: #ffffff;
    height: 120px;
}

.ding {
    margin-left: 20px;
    background: url(@/assets/img/xq4.png) no-repeat;
    background-size: 100% 100%;
    width: 13.75rem;
    color: #ffffff;
    height: 120px;
}
</style>
  